<template>
  <el-dialog
    :visible="visible"
    title="回款明细"
    width="60%"
    @close="$emit('close')"
  >
    <el-table :data="payments" border style="width: 100%; margin-top: 20px">
      <el-table-column prop="paymentDate" label="回款时间" width="180" />
      <el-table-column prop="payment" label="回款金额" width="120" />
      <el-table-column prop="invoice" label="发票信息" width="200" />
      <el-table-column prop="status" label="状态" width="100">
        <template slot-scope="scope">
          <el-tag :type="scope.row.status === '已回款' ? 'success' : 'warning'">
            {{ scope.row.status }}
          </el-tag>
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>
</template>

<script>
export default {
  name: 'PaymentDetailDialog',
  props: {
    visible: Boolean,
    contractData: Object,
    paymentDetails: Array
  },
  data() {
    return {
      payments: this.paymentDetails || []
    }
  },
  mounted() {
    console.log('当前获取的payments参数：', this.payments);
  }
}
</script>

<style scoped>
.el-table {
  margin: 20px 0;
}
</style>
